<template>
    <h2>会员权益添加页面</h2>
    <table border="1">
        <tr>
            <td>权益名称</td>
            <td>
                <input type="text" v-model="right.Right_Name"/>
            </td>
        </tr>      
        <tr>
            <td>权益图标</td>
            <td>
                <img style="width:70px;height:70px" :src="right.Right_Img"/>
                <input type="file" @change="fileUpLoad" />
            </td>
        </tr>
        <tr>
            <td>权益说明</td>
            <td>
                <textarea rows="3" v-model="right.Right_Info"></textarea>
            </td>
        </tr>   
        <tr>
            <td>权益状态</td>
            <td>
                <input type="radio" :value="true" v-model="right.Right_State"/>启用
                <input type="radio" :value="false" v-model="right.Right_State"/>禁用
            </td>
        </tr>      
        <tr>
            <td></td>
            <td>
                <input type="button" value="添加" @click="addRight" />
            </td>
        </tr>
    </table>
</template>

<script setup lang="ts">
    import {ref} from 'vue'
    import {useRouter} from 'vue-router'
    const router=useRouter();
    import axios from 'axios'
    const file=ref(null);
    const fileUpLoad=(e)=>{
        file.value=e.target.files[0];
        if(!file.value)
        {
            alert('请上传文件');
            return;
        }
        const formData=new FormData();
        formData.append('image',file.value);
        axios.post('https://localhost:7292/api/File/FileUpLoad',formData)
        .then(res=>{
            if(res.data.FileCode==1)
            {
                alert(res.data.FileMessage);
            }
            else if(res.data.FileCode==2)
            {
                alert(res.data.FileMessage);
            }
            else
            {
                alert(res.data.FileMessage);
                right.value.Right_Img=res.data.FilePath;
            }
        })
    }

    const right=ref( {
      "Right_Id": 1,
      "Right_Name": "",
      "Right_Img": "",
      "Right_Info": "",
      "Right_State": true
    })
    const addRight=()=>{
        if(right.value.Right_Name=="")
        {
            alert('权益名称不能为空');
            return;
        }

        axios.post('https://localhost:7292/api/Member/RightAdd',{
            "Right_Name": right.value.Right_Name,
      "Right_Img":  right.value.Right_Img,
      "Right_Info":  right.value.Right_Info,
      "Right_State":  right.value.Right_State
        })
        .then(res=>{
            if(res.data==-1)
            {
                alert('会员名称不能重复');
            }
            else if(res.data>0)
            {
                alert('添加成功');
                router.push('/showRight');
            }
            else
            {
                alert('添加失败');
            }
        })
    }

</script>